<!DOCTYPE html>
<meta charset="utf-8">
<head>
<script type="text/javascript" src="d3/d3.js"></script>
</head>

<body>

<p>Line 1</p>
<p>Line 2</p>
<p>Line 3</p>
<p>Line 4</p>
<p>Line 5</p>
<p>Line 6</p>
<p>Line 7</p>
<p>Line 8</p>

<script type="text/javascript">
	var dataset = [10,12,14,16,18,20,22];
	var paragraphs = d3.select("body").selectAll("p").data(dataset);

	paragraphs.style("font-size", function(d) {return (d+"px");})
		.style("font-size", function(d) {return (d+"px");})
		.style("font-family", "Courier")
		.style("color", "red");

	paragraphs.enter()
	    .append("p")
	    .text(function (d,i) {return "Line " + (i+1);})
		.style("font-size", function(d) {return (d+"px");})
		.style("font-family", "Courier")
		.style("color", "red");

	paragraphs.exit()
		.text("null")
	    .style("color", "blue")
	    .style("font-style", "italic");
</script>

</body>
